<script setup lang="ts">
import { computed } from 'vue';
import { IPackNifi } from '../../inter';
import {t} from "../../i18n/index"
// import { ref } from 'vue';

const { nifi,cell } = defineProps<IPackNifi.CellProps>();
//
const mode = computed(() => nifi.graph.mode.value)
const sn = nifi.Select.selectCount
const id = cell.id;



// 粘贴 取消复制 刷新 查看 编辑 清空列数据 开始 停止 启用 禁用 启用所有控制器服务 禁用所有控制器服务 创建模板 上传模板
const handlePaster = () => { nifi.Select.paster(nifi.contextmenu.getLocalPos()); }
// const handleCenter = () => {}
const handleRefresh = () => {  }
const handleCenter = () => { nifi.graph.centerCell(cell) }
// const handleSelectAll = () => { nifi.Select.select(); }
// const handleSelectInverse = () => { nifi.Select.inverse(); }

const handleCopy = () => {nifi.Select.copy() }
const handleBatchDelete = () => { nifi.Select.batchDelete()}
const handleEdit = () => { }
const handleDelete = () => { }
const handleView = () => { }
//
const handleStart = () => { }
const handleStop = () => { }
const handleEnable = () => { }
const handleDisable = () => { }
const handleEnableCS = () => { nifi.ControlService.enableAll(id) }
const handleDisableCS = () => { nifi.ControlService.disableAll(id) }
const handleUploadTemp = () => { }
const handleCreateTemp = () => { }
const handleClearQuene = () => { }
</script>

<template>
    <div v-if="mode == 'prod'" class="w-fit h-fit">
        <div class="flex items-center icon-btn" @click="handleRefresh"><i></i><span>{{t('cells-contextmenu-refresh')}}</span></div>
        <div class="flex items-center icon-btn" @click="handleRefresh"><i></i><span>{{t('cells-contextmenu-center')}}</span></div>
        <div class="h-1px bg-gray-200 m-y-4px"></div>
        <div class="flex items-center icon-btn" @click="handleView"><i></i><span>{{t('cells-contextmenu-view')}}</span></div>
    </div>
    <div v-else-if="sn > 1" class="w-fit h-fit">
        <div class="flex items-center icon-btn" @click="handleCopy"><i></i><span>{{t('cells-contextmenu-copy')}}</span></div>
        <div class="flex items-center icon-btn" @click="handleBatchDelete"><i></i><span>{{t('cells-contextmenu-deletes')}}</span></div>
    </div>
    <div v-else class="relative w-fit gap-x-20px max-h-240px flex flex-col flex-wrap">
        <div class="flex items-center icon-btn" @click="handleRefresh"><i></i><span>{{t('cells-contextmenu-refresh')}}</span></div>
        <div class="flex items-center icon-btn" @click="handleCenter"><i></i><span>{{t('cells-contextmenu-center')}}</span></div>
        <div class="h-1px bg-gray-200 m-y-4px"></div>

        <div class="flex items-center icon-btn" @click="handleEdit"><i></i><span>{{t('cells-contextmenu-edit')}}</span></div>
        <div class="flex items-center icon-btn" @click="handleDelete"><i></i><span>{{t('cells-contextmenu-delete')}}</span></div>
        <div class="flex items-center icon-btn" @click="handleCopy"><i></i><span>{{t('cells-contextmenu-copy')}}</span></div>
        <div class="h-1px bg-gray-200 m-y-4px"></div>
        <div class="flex items-center icon-btn" @click="handleStart"><i></i><span>{{t('cells-contextmenu-start')}}</span></div>
        <div class="flex items-center icon-btn" @click="handleStop"><i></i><span>{{t('cells-contextmenu-stop')}}</span></div>
        <div class="flex items-center icon-btn" @click="handleEnable"><i></i><span>{{t('cells-contextmenu-enable')}}</span></div>
        <div class="flex items-center icon-btn" @click="handleDisable"><i></i><span>{{t('cells-contextmenu-disable')}}</span></div>
        <div class="h-1px bg-gray-200 m-y-4px"></div>
        <div class="flex items-center icon-btn" @click="handleEnableCS"><i></i><span>{{t('cells-contextmenu-enable-all-cs')}}</span></div>
        <div class="flex items-center icon-btn" @click="handleDisableCS"><i></i><span>{{t('cells-contextmenu-disable-all-cs')}}</span></div>
        <!-- <div class="h-1px bg-gray-200 m-y-4px"></div>
        <div class="flex items-center icon-btn" @click="handleUploadTemp"><i></i><span>上传模板</span></div>
        <div class="flex items-center icon-btn" @click="handleCreateTemp"><i></i><span>创建模板</span></div> -->
        <div class="h-1px bg-gray-200 m-y-4px"></div>
        <div class="flex items-center icon-btn" @click="handleClearQuene"><i></i><span>{{t('cells-contextmenu-clear-all-quene')}}</span></div>
    </div>
</template>